<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
    /*
      window对象
        —— 在浏览器中，为我们提供了一个window对象，可以直接访问
        —— window对象代表的是浏览器的窗口，通过该对象可以对浏览器窗口进行各种操作
          除此之外，window对象还负责存储JS中的内置对象和浏览器的宿主对象
    */
   var a = 20
   console.log(window.a) // 20

   // 由此可见，通过var声明的变量，都会被挂载到window上

   function fn() {
    alert('我是fn')
   }
   console.log(window.fn) // 使用function关键字创建的函数也会被挂载到window上

   function fn2 () {
    var d = 10
   }
   fn2()
   // console.log(d) // 报错 var没有块作用域，但是有函数作用域，此刻不会被挂载到window上

   function fn3 () {
    f = 10  // 在局部作用域中，如果没有使用var 也没有使用let声明变量，变量会自动挂载到window上
    // 相当于 window.f = 10  这种方式很不好，不建议这么使用
   }
   fn3()
   console.log(f) // 10
  </script>
</body>
</html>